<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@include file="../../include/publicMeta.jsp"%>

<article class="cl pd-20">
    <form action="/product/addProduct" method="post" enctype="multipart/form-data" class="form form-horizontal" id="form-admin-add"  target="_parent">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>商品名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="" id="name" name="name" required>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>商品单价：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" autocomplete="off" value="" placeholder="" id="price" name="price" required>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>人气：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" autocomplete="off" value="" placeholder="" id="zan" name="zan" required>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>销量：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" autocomplete="off" value="" placeholder="" id="number" name="number" required>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>描述：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <div id="div1"></div>
                <textarea class="textarea" cols="100" rows="100" id="miaoshu" name="miaoshu" required></textarea>
            </div>
        </div>
        <script src="${pageContext.request.contextPath}/assets/js/jquery-3.3.1.js"></script>
        <script src="${pageContext.request.contextPath}/assets/js/wangEditor.min.js"></script>
        <script>
            var E = window.wangEditor;
            var editor = new E('#div1');
            var $text1 = $('#miaoshu');
            editor.customConfig.onchange = function (html) {
                $text1.val(html); // 监控变化，同步更新到 textarea
            };
            editor.create();
            $text1.val(editor.txt.html()); // 初始化 textarea 的值
        </script>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>上传图片：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="file" name="upload" accept="image/*" required/>
                <input type="file" name="upload" accept="image/*" required/>
                <input type="file" name="upload" accept="image/*" required/>
                <input type="file" name="upload" accept="image/*" required/>
                <input type="file" name="upload" accept="image/*" required/>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">分类：</label>
            <div class="formControls col-xs-8 col-sm-9"> <span class="select-box" style="width:150px;">
                <select class="select" name="cid" size="1" required>
                    <c:forEach items="${categoryList}" var="category">
                        <option value="${category.id}">${category.name}</option>
                    </c:forEach>
                </select>
                </span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">商家：</label>
            <div class="formControls col-xs-8 col-sm-9"> <span class="select-box" style="width:150px;">
                <select class="select" name="bid" size="1" required>
                    <c:forEach items="${userList}" var="user">
                        <option value="${user.id}">${user.name}</option>
                    </c:forEach>
                </select>
                </span>
            </div>
        </div>
        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>
<%@include file="../../include/publicFooter.jsp"%>

<script type="text/javascript">
    $(function(){
        // Custom form validation
        $('#form-admin-add').submit(function(event) {
            var valid = true;
            // Check each required input
            $('#form-admin-add').find('[required]').each(function() {
                if (!$(this).val()) {
                    valid = false;
                    alert('请填写所有必填字段');
                    $(this).focus();
                    return false; // Break out of the loop
                }
            });
            if (!valid) {
                event.preventDefault();
            }
        });
    });
</script>
</body>
</html>
